<!DOCTYPE html>
<html lang="en">

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <style>
        .info_section {
            word-wrap: break-word;
        }
    </style>
</head>

<body>
    <div class="container">
        <div class="row">
            <div class="col-md-6 offset-md-3 text-xs-center">
                <div class="form-group">
                    <label for="password">密码</label>
                    <input type="password" class="form-control" id="password">
                </div>
                <div class="form-group">
                    <button onclick="createAccount()" class="btn btn-primary">创建用户</button>
                </div>
                <div class="form-group">
                    <label for="text">新建用户的以太坊地址</label>
                    <div class="alert alert-info" role="alert" id="accountCreatedInfo">
                    </div>
                </div>
                <div class="form-group">
                    <label for="accountList" onclick="accountList()">账号列表</label>
                    <ul id="accountList" style="text-align: left;">
                    </ul>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6 offset-md-3 text-xs-center">
                <br>
                <h3>上传个文件</h3>
                <br>
                <div>
                    <div class="form-group">
                        <label class="custom-file text-xs-left">
                            <input type="file" id="file" class="custom-file-input">
                            <span class="custom-file-control"></span>
                        </label>
                    </div>
                    <div class="form-group">
                        <label for="owner">录入文件拥有者名字</label>
                        <input type="text" class="form-control" id="owner">
                    </div>
                    <div class="form-group">
                        <label for="owner">提交者账户地址</label>
                        <input type="text" class="form-control" id="ownerAddress">
                    </div>
                    <div class="form-group">
                        <button onclick="submit()" class="btn btn-primary">提交事务</button>
                    </div>
                    <div class="alert alert-info info_section" role="alert" id="submittedTxInfo">
                        提交的事务
                    </div>
                    <div class="form-group">
                        <button onclick="getFileInfo()" class="btn btn-primary">获取文件信息</button>
                    </div>
                    <div class="form-group">
                        <label for="owner">读者账户地址</label>
                        <input type="text" class="form-control" id="readerAddress">
                    </div>
                    <div class="alert alert-info info_section" role="alert" id="fileInfo">
                        获取文件信息
                    </div>

                    <div class="form-group">
                        <label for="owner">事务地址</label>
                        <input type="text" class="form-control" id="txAddress">
                    </div>
                    <div class="form-group">
                        <button onclick="getTransactionInfo()" class="btn btn-primary">获取事务信息</button>
                    </div>
                    <div class="alert alert-info info_section" role="alert" id="txInfo">
                        获取事务信息
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6 offset-md-3 text-xs-center">
                <br>
                <h3>完成的事务</h3>
                <br>
                <ol id="events_list">未发现事务</ol>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="/js/sha1.min.js"></script>
    <script type="text/javascript" src="/js/jquery.min.js"></script>
    <script type="text/javascript" src="/js/socket.io.min.js"></script>
    <script type="text/javascript" src="/js/main.js"></script>
    <script>
        $(document).ready(function () {
            accountList()
            transactionList()
        });
    </script>
</body>

</html>